<template>
	<view>
		<cu-custom bgColor="bg-gradual-blue" :isBack="true">
			<block slot="backText">返回</block>
			 <block slot="content">维保前信息录入</block>
		</cu-custom>
		
		<view class="content">
			<active-form style="width:100% !important;" :formDate.sync="formData" num></active-form>
			<view class="padding-lr flex margin-top-sm" style="justify-content: space-between;height: 220rpx;">
			</view>
			<view class="publish-goods-wrap">
				<view class="publish-goods-btn" @click="sub">提交</view>
			</view>
		</view>
	</view>
</template>



<script>
import ActiveForm from "@/components/active-form/active-form";
import request from '@/common/request.js';
import QQMapWX from "@/common/qqmap-wx-jssdk";
export default {
  components: {
    ActiveForm
  },
  data() {
    return {		
		Location:{
			latitude:'',
			longitude:'',
			address:''
		},
		requestData:{
			qrcodeId:'',
			jobId:'',
			isyuqi:false,
			zhouqi:'',
			Desc:'',
			Images:[],
			Video:'',
		},
        formData: [
		  {
		  	id: "asdfgf",
		  	placeholder: "请输入描述",
		  	label: "现场描述",
		  	type: "textarea",
		  	rules: {
		  		name: "Desc",
		  		value: "", //字段值
		  		verify: false,
		  		errMess: "请输入描述",
		  	},
		  }, 
		  {
		  	id: "asdfdfgd",
		  	placeholder: "维保前照片",
		  	label: "维保前照片 ",
		  	type: "image",
		  	watermark: {
		  		UserName: '',
		  		JobName: '',
		  		nowTime: '',
		  		address: '',
		  		jingweidu: '',
				chooseAlbum:false
		  	},
		  	rules: [{
		  		name: "photo1",
		  		value: "",
		  		verify: false,
		  		errMess: "拍摄照片1",
		  	}, {
		  		name: "photo2",
		  		value: "",
		  		verify: false,
		  		errMess: "拍摄照片2",
		  	}, {
		  		name: "photo3",
		  		value: "",
		  		verify: false,
		  		errMess: "拍摄照片3",
		  	}],
		  }, 
		  {
		  	id: "asdf111gd",
		  	placeholder: "维保前视频",
		  	label: "维保前视频 ",
		  	type: "video",
		  	url: '',
		  	rules: {
		  		name: "video",
		  		value: "",
		  		verify: false,
		  		errMess: "拍摄维保前视频",
		  	},
		  }
      ],
    };
  },
  onLoad(option){
	let that=this
	that.requestData.qrcodeId=option.qrcodeId
	that.requestData.jobId=option.jobId
	that.requestData.isyuqi=option.isyuqi
	that.requestData.zhouqi=option.zhouqi
	//获取位置和缓存
	that.getWaterMarkSettings()
  },
  onShow: function() {
  },
  created() {
	let that=this
  },
  mounted() {
	let that=this
  },
  methods: {
	async getWaterMarkSettings(){
		let that=this
		let imageIndex= that.formData.findIndex(e => e.id === 'asdfdfgd')
		uni.getStorage({
			key: 'userdata',
			success: function (res1) {
				that.formData[imageIndex].watermark.UserName=res1.data.RealName
			}
		});
		uni.getLocation({
			type: 'gcj02',
			altitude: true,
			success(res) {
				that.formData[imageIndex].watermark.jingweidu=res.latitude+','+res.longitude
			}
		})
		
		uni.getStorage({
			key: 'userdata',
			success: function (res1) {
				that.formData[imageIndex].watermark.UserName=res1.data.RealName
			}
		});
		that.getTime()
	},
	getTime: function() {
		let that=this
		 let imageIndex= that.formData.findIndex(e => e.id === 'asdfdfgd')
		var date = new Date(),
			year = date.getFullYear(),
			month = date.getMonth() + 1,
			day = date.getDate(),
			hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
			minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes(),
			second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
		month >= 1 && month <= 9 ? (month = "0" + month) : "";
		day >= 0 && day <= 9 ? (day = "0" + day) : "";
		var timer = year + '年' + month + '月' + day + '日';
		var timer2 = hour + ':' + minute + ':' + second;
		that.formData[imageIndex].watermark.nowTime=timer+' '+timer2
	},
    // 提交表单
    async sub() {
		let videoIndex=2
		let imageIndex=1
		this.$vervify(this.formData); //表单校验 成功会继续往下走 失败抛出异常
		const res = this.$submitForm(this.formData); //校验成功 获取表单值
		
		let that=this
		let opts = {
			url: 'SpareApi/AddWbBeforeInfo',
			method: 'post'
		};
		that.requestData.Desc=res.Desc;
		let images=[]
		if(this.formData[imageIndex].rules[0].value!=null&&this.formData[imageIndex].rules[0].value!=''){
			images.push('/qiniu'+this.formData[imageIndex].rules[0].value.split('qiniu')[1])
		}
		if(this.formData[imageIndex].rules[1].value!=null&&this.formData[imageIndex].rules[1].value!=''){
			images.push('/qiniu'+this.formData[imageIndex].rules[1].value.split('qiniu')[1])
		}
		if(this.formData[imageIndex].rules[2].value!=null&&this.formData[imageIndex].rules[2].value!=''){
			images.push('/qiniu'+this.formData[imageIndex].rules[2].value.split('qiniu')[1])
		}
		that.requestData.Images=images;
		that.requestData.Video=this.formData[videoIndex].rules.value;
		
		request.httpTokenRequest(opts,that.requestData).then(res => {
			if(res.data.code == 1){
				uni.showToast({ title:'添加成功', icon: '/static/success.png' });
				
				uni.$emit('beforeUpdateKey',res.data.msg)
				uni.navigateBack({
				    delta: 1, 
				});
			}
			else{
				uni.showToast({ title: res.data.msg, icon: 'none' });
			}
		})
    },
  },
};
</script>

<style lang="less">
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  .subform {
	left: 5%;
	bottom: 8%;
	width: 90%;
	text-align: center;
    padding: 20rpx 60rpx;
    border-radius: 18rpx;
    background-color: #0081ff;
	color: white;
  }
}

	.publish-goods-wrap {
		background: rgba(255, 255, 255, .5);
		padding: 24rpx;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
	}

	.publish-goods-btn {
		margin: 24rpx;
		background: #0079FE;
		color: #FFFFFF;
		height: 82rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 82rpx;
	}

	.goods-empty-wrap {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 40%;
	}
	.content {
	  display: flex;
	  flex-direction: column;
	  align-items: center;
	  justify-content: center;
	  //padding-top: 30rpx;
	}
	
	.chooseBox{
		width: 95%;
		background-color: #fff;
		margin: auto;
		border-radius: 20rpx;
		padding: 47rpx 30rpx 27rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		.titleleftBox{
			display: flex;
			align-items: center;
			width: 90%;
		}
		.choose{
			padding-left: 34rpx;
			font-weight: 600;
			font-size: 28rpx;
			color: #000000;
		}
		.rapid{
			font-size: 28rpx;
			font-weight: 500;
			margin-left: 20rpx;
			color: #333;
			width: 70%;
		}
		.select-icon{
			float: right;
			border-bottom: 2upx solid #999;
			border-right: 2upx solid #999;
			width: 16upx;
			height: 16upx;
			transform: rotate(-45deg);
			margin-right: 30rpx;
		}
	}
</style>